// app/evcp/(evcp)/permissions/page.tsx

"use client";

import { useState } from "react";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Shield, Users, Key, Menu, Search, Plus } from "lucide-react";
import { RolePermissionManager } from "@/components/permissions/role-permission-manager";
import { PermissionAssignmentManager } from "@/components/permissions/permission-assignment-manager";
import { UserPermissionManager } from "@/components/permissions/user-permission-manager";
import { PermissionGroupAssignmentManager } from "@/components/permissions/permission-group-assignment-manager";

export default function PermissionManagementPage() {
  const [searchTerm, setSearchTerm] = useState("");
  const [selectedTab, setSelectedTab] = useState("by-role");

  return (
    <div className="container mx-auto p-6">
      <div className="mb-6">
        <h1 className="text-3xl font-bold mb-2">권한 관리</h1>
        <p className="text-muted-foreground">
          시스템 권한을 역할, 사용자, 메뉴별로 관리합니다.
        </p>
      </div>

      <Tabs value={selectedTab} onValueChange={setSelectedTab}>
        <TabsList className="grid w-full grid-cols-4">
          <TabsTrigger value="by-role">
            <Users className="mr-2 h-4 w-4" />
            역할별 관리
          </TabsTrigger>
          <TabsTrigger value="by-user">
            <Shield className="mr-2 h-4 w-4" />
            사용자별 관리
          </TabsTrigger>
          <TabsTrigger value="by-permission">
            <Key className="mr-2 h-4 w-4" />
            권한별 관리
          </TabsTrigger>
          <TabsTrigger value="by-group">
            <Menu className="mr-2 h-4 w-4" />
            그룹별 관리
          </TabsTrigger>
        </TabsList>

        {/* 역할별 권한 관리 */}
        <TabsContent value="by-role">
          <RolePermissionManager />
        </TabsContent>

        {/* 사용자별 권한 관리 */}
        <TabsContent value="by-user">
          <UserPermissionManager />
        </TabsContent>

        {/* 권한별 사용자/역할 관리 */}
        <TabsContent value="by-permission">
          <PermissionAssignmentManager />
        </TabsContent>

{/* 권한 그룹별 사용자/역할 관리 */}
<TabsContent value="by-group">
          <PermissionGroupAssignmentManager />
        </TabsContent>
      </Tabs>
    </div>
  );
}